鐵人賽執行至今，我才深刻體會到 3D Tutting 模擬器如果只有演算法，編舞效率其實非常低落。

當你真正坐下來、準備編排一套 32 拍的完整 Tutting 招式時，你會發現最大的痛苦往往不是「算式不準」，而是「操作效率太慢」——手滑調錯角度要重來、雙手對稱要手動調兩次、還得不斷用滑鼠旋轉視角確認手框有沒有歪。

今天 DAY 19，我們要暫時放下關節演算法，為我們的模擬器注入 5 大生產力輔助設計功能，讓編舞體驗直接提升一個量級！

5 大輔助功能技術解構

1. Undo / Redo (歷史紀錄棧)

• 編舞痛點：微調食指關節時不小心拖錯，導致擺好的手框整塊崩塌。
• 實作機制：採用 Command Pattern（命令模式）。每當關節釋放（pointerup）、拍點新增或姿勢切換時，將當前的全體骨骼角度與 IK 狀態壓縮為 JSON Snapshot 推入 historyStack。按下 Ctrl+Z (Undo) 或 Ctrl+Y (Redo) 即可毫秒級復原。

2. Mirroring (肢體鏡像功能)

• 編舞痛點：Tutting 極度強調幾何對稱。左手做了一個複雜的 90° 折疊，右手要重做一次極度耗時。
• 實作機制：提供兩大鏡像模式：
  • 左 右 複製：將左肢體骨骼角度映射至右肢體，並自動對 X 軸旋轉角做符號反轉（rRot.x = -lRot.x）。
  • 雙手對稱反轉：一鍵將左右手姿勢進行互換，極速產生對稱卡點。
    

3. Camera Presets (幾何視角切換)

• 編舞痛點：Tutting 是一種利用 2D 透視創造 3D 視覺錯覺的藝術。在自由 Orbit 鏡頭下看很準，但換到正面觀眾視角卻發現手臂歪了 5 度。
• 實作機制：新增 4 大幾何 Preset 視角切換：
  • 正視圖 (Front)：檢查正方形 Hand Box 是否平行水平線。
  • 側視圖 (Side) / 俯視圖 (Top)：檢查關節是否有不必要的向前/向後突出。
  • 透視/正交切換 (Perspective / Orthographic)：一鍵切換為無透視畸變的正交視角，還原最純粹的幾何線條。

4. Onion Skinning (洋蔥皮殘影)

• 編舞痛點：無法直觀確認這一拍的手腕是否精準停留在上一拍的 Fixed Point（不動點）。
• 實作機制：在 3D 場景中生成一具半透明的網格模型（Dummy Mesh）：
  • 🟢 前一拍 (N-1)：顯示綠色半透明殘影（Opacity: 0.35）。
  • 🔴 後一拍 (N+1)：顯示紅色半透明殘影（Opacity: 0.35）。
    舞者能一眼看出手掌在過渡期間的軌跡偏移量，精準鎖定 Fixed Point 與 Isolation。

5. Auto-Save (自動存檔)

• 編舞痛點：瀏覽器快取清除或誤觸 F5，編排好的 64 拍 Keyframe 全部歸零。
• 實作機制：建立 Debounce 自動存檔機制。當使用者停止操作 1.5 秒後，系統自動將整套時間軸、BPM 設定與 - Easing 參數寫入 localStorage（Key: tutting_autosave_data）。頁面重新載入時自動彈出「恢復上次未儲存草稿」提示。

結語：工欲善其事，必先利其器

有了這 5 大輔助設計功能，我們的 Tutting 模擬器不僅具備硬核的算式底層，更真正轉化為一套符合專業舞蹈創作者直覺的現代化 3D 繪圖軟體！

Prompt 提供

# Prompt — 5 大輔助功能

---
**（本次新增，共 5 項）**
1. **自動存檔**：`localStorage`，debounce 1.5秒寫入，存 `keyframes[]`／軌跡控制點座標／路徑模式／BPM／Easing-拍數預設。載入時偵測到存檔會 `confirm()` 詢問是否還原。右上角有淡入淡出的「已自動儲存 HH:MM:SS」提示。
2. **Undo/Redo（角度層級）**：涵蓋姿勢庫切換、隨機姿勢、鏡像、JSON套用、關節拖曳放開、此關節歸零、拍點增刪改、Easing/拍數調整、軌跡生成拍點。**刻意不含** IK目標球位置/開關、身體即時位置（複雜度不成比例）。`Ctrl+Z`／`Ctrl+Shift+Z` 快捷鍵，History stack 上限 50 筆。
3. **鏡像（Mirror）**：世界空間四元數鏡射公式 `(x,-y,-z,w)` + 由上而下沿骨架階層重建本地旋轉，**非猜測式的軸符號表**，數學正確性已用 Node.js 合成對稱骨架模擬驗證（位置/朝向誤差 <1e-15，雙重鏡像可還原原姿勢）。已知限制：若肢體正開著IK，鏡像後下一幀會被IK即時解算覆蓋（IK目標球不會跟著鏡像）。
4. **幾何鏡頭（輕量版）**：正面/背面/左側/右側/俯視/45°六個預設視角按鈕，按角色身高比例換算相機位置，500ms easeInOutQuad 平滑過渡到位（不是瞬間跳）。沒有另外做正交相機。
5. **洋蔥皮（Onion Skinning）**：用 `SkeletonUtils.clone(model)` 複製兩份獨立骨架的半透明殘影（青色=上一拍、洋紅=下一拍），只在「選取某拍點」且「時間軸分頁」時顯示，只在拍點清單重繪時才重新計算姿勢（非每幀）。